import 'package:flutter/material.dart';
import 'package:flutter_myshop/common/constant.dart';
import 'package:flutter_myshop/common/method.dart';
import 'package:flutter_myshop/model/shoping_car.dart';
import 'package:flutter_myshop/provide/applicaiton.dart';
import 'package:flutter_myshop/provide/shoping_car.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:fluttertoast/fluttertoast.dart';
import 'package:provide/provide.dart';

/*
 * 购物车
 */
class ShoppingCar extends StatelessWidget {
  // main
  @override
  Widget build(BuildContext context) {
    // 从本地同步数据
    Provide.value<ShopingCarProvider>(context).syncCarFromPersistence();
    return Scaffold(
      appBar: AppBar(
        title: Text("购物车"),
      ),
      body: Container(
        child: Provide<ShopingCarProvider>(
          builder: (context, child, item) {
            // 定位哪个商品数据改变
            int changIndex = 0;
            return Container(
              child: Card(
                child: Stack(
                  children: <Widget>[
                    // 商品展示栏
                    ListView(
                      children: item.carGoodList.map((good) {
                        return _oneRoom(good, context, changIndex++);
                      }).toList(),
                    ),
                    // 底部结算
                    _bottomSettleBar(context),
                  ],
                ),
              ),
            );
          },
        ),
      ),
    );
  }

  //cate 组件
  //单个展示框
  Widget _oneRoom(Good good, context, int changeIndex) {
    return Container(
      decoration: BoxDecoration(
        border: Border(
          bottom: BorderSide(color: Colors.black12, width: 1.5),
        ),
      ),
      height: ScreenUtil().setHeight(68),
      width: ScreenUtil().setWidth(Constant.MAX_WIDTH_SCREEN),
      child: Row(
        children: <Widget>[
          // 选择按钮
          Container(
            width: ScreenUtil().setWidth(30),
            child: InkWell(
              onTap: () {
                Provide.value<ShopingCarProvider>(context).checkOne(good.id);
              },
              child: Icon((Provide.value<ShopingCarProvider>(context)
                      .checkIdList
                      .contains(good.id))
                  ? Icons.radio_button_checked
                  : Icons.radio_button_unchecked),
            ),
          ),
          // 图像
          Container(
            width: ScreenUtil().setWidth(50),
            child: Image.network(
              good.images,
              fit: BoxFit.fill,
            ),
          ),
          // 名字和加减按钮
          Container(
            width: ScreenUtil().setWidth(140),
            child: Column(
              children: <Widget>[
                // name
                Container(
                  alignment: Alignment.topLeft,
                  margin: EdgeInsets.only(
                      top: ScreenUtil().setHeight(10),
                      left: ScreenUtil().setWidth(8)),
                  child: Text(
                    good.name,
                    textAlign: TextAlign.left,
                    maxLines: 2,
                    style: TextStyle(
                      fontSize: ScreenUtil().setSp(12),
                    ),
                  ),
                ),
                // + - 按钮
                Container(
                  decoration: BoxDecoration(
                    border: Border(
                      bottom: BorderSide(color: Colors.black12, width: 1.5),
                      top: BorderSide(color: Colors.black12, width: 1.5),
                    ),
                  ),
                  margin: EdgeInsets.only(
                      top: ScreenUtil().setHeight(17.5),
                      right: ScreenUtil().setWidth(71)),
                  height: ScreenUtil().setHeight(17),
                  width: ScreenUtil().setWidth(55),
                  child: Row(
                    children: <Widget>[
                      // - 按钮
                      Expanded(
                        child: Container(
                          decoration: BoxDecoration(
                            border: Border(
                              left:
                                  BorderSide(color: Colors.black12, width: 1.5),
                              right:
                                  BorderSide(color: Colors.black12, width: 1.5),
                            ),
                          ),
                          child: InkWell(
                            onTap: () {
                              // log  减少购物车数目
                              print('点击了-按钮.....');
                              //? 数目归零
                              // 归零
                              if (good.count <= 1) {
                                Fluttertoast.showToast(
                                    msg: "数目已经最小了,不能再减了,亲",
                                    toastLength: Toast.LENGTH_SHORT,
                                    gravity: ToastGravity.CENTER,
                                    timeInSecForIos: 1,
                                    backgroundColor: Colors.blue,
                                    textColor: Colors.white,
                                    fontSize: 16.0);
                              }
                              // 未归零
                              else {
                                ProviderApplication.shopingCarProvider
                                    .deleteGoodCount(changeIndex);
                              }
                            },
                            child: Icon(Icons.remove),
                          ),
                        ),
                      ),
                      // count
                      Expanded(
                        child: Container(
                          child: Text(
                            "${good.count}",
                            textAlign: TextAlign.center,
                          ),
                        ),
                      ),
                      // + 按钮
                      Expanded(
                        child: Container(
                          decoration: BoxDecoration(
                            border: Border(
                              left:
                                  BorderSide(color: Colors.black12, width: 1.5),
                              right:
                                  BorderSide(color: Colors.black12, width: 1.5),
                            ),
                          ),
                          child: InkWell(
                            onTap: () {
                              // log  增加购物车商品数目
                              print('点击了+按钮.....');
                              ProviderApplication.shopingCarProvider
                                  .addGoodCount(changeIndex);
                            },
                            child: Icon(Icons.add),
                          ),
                        ),
                      ),
                    ],
                  ),
                ),
              ],
            ),
          ),
          // 价格和删除符号
          Expanded(
            child: Container(
              child: Column(
                children: <Widget>[
                  // 价格
                  Container(
                    margin: EdgeInsets.only(
                        top: ScreenUtil().setHeight(8),
                        bottom: ScreenUtil().setHeight(8)),
                    child: Text(
                      "¥  ${good.price}",
                      maxLines: 1,
                      style: TextStyle(fontSize: ScreenUtil().setSp(10)),
                    ),
                  ),
                  Container(
                    child: InkWell(
                      onTap: () {
                        // log 删除购物车商品
                        print("点击删除购物车商品....");
                        Provide.value<ShopingCarProvider>(context)
                            .clearOne(good);
                      },
                      child: Icon(
                        Icons.delete,
                        size: ScreenUtil().setSp(26),
                        color: Colors.black26,
                      ),
                    ),
                  ),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }

  //底部结算框
  Widget _bottomSettleBar(context) {
    int barHeight = 35;
    return Positioned(
        top: ScreenUtil().setHeight(Constant.MAX_HEIGHT_SCREEN -
            barHeight -
            Constant.APP_BAR_HEIGHT_SCREEN -
            Constant.APP_NAV_HEIGHT_SCREEN),
        child: Container(
          decoration: BoxDecoration(
            border: Border(
              top: BorderSide(color: Colors.black12, width: 1.5),
            ),
          ),
          height: ScreenUtil().setHeight(barHeight),
          width: ScreenUtil().setWidth(Constant.MAX_WIDTH_SCREEN),
          child: Container(
            color: Colors.white,
            child: Row(
              children: <Widget>[
                // 全选按钮
                Container(
                  margin: EdgeInsets.only(
                    right: ScreenUtil().setWidth(8),
                    left: ScreenUtil().setWidth(15),
                  ),
                  child: InkWell(
                    onTap: () {
                      // log 全选
                      print("点击全选.......");
                      Provide.value<ShopingCarProvider>(context).checkAll();
                    },
                    child: Icon((Provide.value<ShopingCarProvider>(context)
                                .checkIdList
                                .length == //? 是否已全选
                            Provide.value<ShopingCarProvider>(context)
                                .carGoodList
                                .length)
                        ? Icons.radio_button_checked
                        : Icons.radio_button_unchecked),
                  ),
                ),
                // 全选文字
                Container(
                  margin: EdgeInsets.only(
                    right: ScreenUtil().setWidth(51),
                  ),
                  child: Text(
                    "全选",
                    textScaleFactor: 1.1,
                  ),
                ),
                // 计费
                Container(
                  margin: EdgeInsets.only(
                    top: 5,
                    right: ScreenUtil().setWidth(10),
                  ),
                  child: InkWell(
                    child: Column(
                      children: <Widget>[
                        // 合计
                        Container(
                          child: Row(
                            children: <Widget>[
                              Text(
                                "合计:  ",
                                textScaleFactor: 1.2,
                              ),
                              // 价格统计
                              Container(
                                margin: EdgeInsets.only(
                                  top: ScreenUtil().setHeight(4),
                                ),
                                child: Text(
                                  "¥  ${MathUtil.formatDuble(ProviderApplication.shopingCarProvider.totalPrice, 2)}",
                                  textScaleFactor: 1.1,
                                  textAlign: TextAlign.right,
                                  style: TextStyle(
                                    color: Colors.orange[900],
                                  ),
                                ),
                              ),
                            ],
                          ),
                        ),
                        // 配送规则
                        Container(
                          child: Text(
                            '满10元免配送费,预购免配送费',
                            textScaleFactor: 0.7,
                          ),
                        ),
                      ],
                    ),
                  ),
                ),
                // 结算按钮
                Container(
                  height: ScreenUtil().setHeight(30),
                  width: ScreenUtil().setWidth(40),
                  decoration: BoxDecoration(
                    color: Colors.orange[900],
                    borderRadius: BorderRadius.circular(3.0),
                  ),
                  child: InkWell(
                    child: Container(
                      margin: EdgeInsets.only(top: ScreenUtil().setHeight(5)),
                      child: Container(
                        child: Text(
                          "结算(${Provide.value<ShopingCarProvider>(context).checkIdList.length})",
                          textAlign: TextAlign.center,
                          style: TextStyle(
                            color: Colors.white,
                            fontSize: ScreenUtil().setSp(11),
                          ),
                        ),
                      ),
                    ),
                  ),
                ),
              ],
            ),
          ),
        ));
  }
}
